<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <title>08_HTML5-新增状态标签-meter</title>

    </head>
    <body>
        <!-- high="90" low="20"合理范围 

            （1）最合适的值在最大值的右边
            min="0" max="100" value="81" high="80" low="20" optimum="90"

            0~19  红色  
            20~79 黄色
            80~100 绿色


            (2)  最合适的值在最小值的左边
            0~19 绿的
            20~79 黄色
            80~100 红色

            (3) 最合适的值在20到80之间  
            除了20到80之间之外都是黄色  
            20~80之间是绿色 
            和不写optimum的一样
        -->


        <meter min="0" max="100" value="1" high="80" low="20" 
               optimum="70"></meter>

        <hr>
        <h1>手机电量</h1>

        <meter min="0" max="100" low="10" high="20" optimum="100"
        value="50"
        ></meter>
    </body>
</html>